import React, { Component } from 'react';

import context from '../../utils/context'
import {withRouter} from 'react-router-dom'
import {categoods} from '../../utils/api'
class Mylist extends Component {
    constructor(props){
        super(props);
        this.state = {
             currentIndex:0,
             kindlist:[],
             list:[
                
            ]
        }
    }
    componentDidMount(){
        //接收三级列表ID
        console.log(this.props.location.state.id);
        categoods({id:this.props.location.state.id}).then((res)=>{
            console.log(res);
            this.setState({
                list:res.data.list
            })
        })
        context.addListener('change',(index)=>{
            // console.log('接收到',index);
            if(index === 1){
                // console.log(this.state.list);
               this.setState({
                list:  this.state.list.sort((a,b)=>{
                    return (b.sale - a.sale)
               })
               })
            }
            if(index === 3){
                this.setState({
                    list:  this.state.list.sort((a,b)=>{
                        return (a.salesPrice.value - b.salesPrice.value)
                   })
                   })
            }
        })  
    }
    handleChange(id){
        console.log(id);
        this.props.history.push({pathname:'/product',state:{id}})
    }
    
    render() {
        return (
            <div className='goodslist'>
                {
                    this.state.list && this.state.list.map((item,index)=>{
                        return (
                            <div className='list' key={index} onClick={()=>{this.handleChange(item.id)}}>
                                <img src={item.pic} alt="" />
                                 <div className='name'>{item.name}</div>
                                 <span className='price'>{item.salesPrice.name}</span>
                                 <div className='buyprice'>￥{item.salesPrice.value}</div>
                            </div>
                        )
                    })
                }
            </div>
        );
    }
}

export default withRouter(Mylist);